<template>
  <div>
    <template>
      <div slot="header" class="clearfix" style="text-align: center;line-height: 30px">
        <h3>报价详情</h3>
      </div>

      <el-form ref="form" label-width="80px">
        <el-row>
          <el-col :span="5">
            <span>采购编号:</span>&emsp;
            <el-button type="button" size="small">{{bmSerial}}</el-button>
          </el-col>
          <el-col :span="5">
            <span>待采购数量:</span>&emsp;
            <el-button type="button" size="small">{{offerNum}}</el-button>
          </el-col>
          <el-col :span="14">
            <el-form-item label="日期">
              <el-input type="date" v-model="sufdate" autocomplete="off" style="width: 350px"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <br>

      <el-table
          :data="offerVoData"
          border
          style="width: 100%">
        <el-table-column
            prop="username"
            label="供应商名称">
        </el-table-column>
        <el-table-column
            prop="usernumber"
            label="供应商编号">
        </el-table-column>
        <el-table-column
            prop="goodsname"
            label="商品名">
        </el-table-column>
        <el-table-column
            prop="type"
            label="类型">
        </el-table-column>
        <el-table-column
            prop="standerd"
            label="规格">
        </el-table-column>
        <el-table-column
            prop="offernum"
            label="报价">
        </el-table-column>
        <el-table-column
            prop="offerinfo"
            label="竞标描述">
        </el-table-column>
        <el-table-column
            fixed="right"
            label="采购数量">
          <template slot-scope="scope">
            <el-input @keyup.13.native="selectClick(scope.row)" v-model.number="scope.row.buynum" style="width: 60px"></el-input>
          </template>
        </el-table-column>
        <el-table-column
            fixed="right"
            label="中标">
          <template slot-scope="scope">
            <el-button @click="bid(scope.row)" type="button" size="small">中标</el-button>
          </template>
        </el-table-column>
        <el-table-column
            fixed="right"
            label="取消采购">
          <template slot-scope="scope">
            <el-button @click="cancel(scope.row)" type="button" size="small">取消</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="block">
        <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="pageNum"
            :page-sizes="[6, 8, 10, 12]"
            :page-size="100"
            layout="total, sizes, prev, pager, next, jumper"
            :total="total">
        </el-pagination>
      </div>
      <br>

      <el-row>
        <el-col :span="24" style="text-align: center">
          <el-button type="primary" @click="closeWin" >关闭</el-button>
        </el-col>
      </el-row>

    </template>
  </div>
</template>

<script>
export default {
  // eslint-disable-next-line vue/multi-word-component-names
  name: "Offer",
  props:{
    bmSerial:String,
    buynum: Number
  },
  data(){
    return{
      pageNum: 1,
      pageSize: 6,
      total: '',
      offerVoData:[],
      offerNum:'',
      sufdate:''
    }
  },
  mounted() {
    this.init(this.bmSerial)
  },
  methods: {
    init(tag) {
      this.offerNum = this.buynum
      let url = '/csc/offer/selectOfferByBuyNumber/' +tag+'/'+ this.pageNum + "/" + this.pageSize
      console.log(url)
      this.$axios.get(url).then(r => {
        console.log(r.data)
        this.offerVoData = r.data.list
        this.total = r.data.total
      })
    },
    handleSizeChange(val) {
      this.pageSize = val
      this.init()
    },
    handleCurrentChange(val) {
      this.pageNum = val
      this.init()
    },
    selectClick(row){
      console.log(row)
      if (row.buynum > this.offerNum){
        this.$message.success("您输入的数量太多")
      }
      this.offerNum = this.buynum - row.buynum
    },
    bid(row) {
      console.log(row)
      this.$confirm('确定投标?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        console.log(row)
        let bidmsg = "您投递的标书中标, 合同信息: 采购编号:"+this.bmSerial+'、商品名'+row.goodsname+'、类型'+row.type+'、规格'+row.standerd+'、报价'+row.offernum+'、竞标描述'+row.offerinfo+'、采购数量'+row.buynum
        let url = '/csc/successful/winBidMsg'
        let fd = new FormData
        fd.append("buynumber",this.bmSerial)
        fd.append("usernumber",row.usernumber)
        fd.append("bid",bidmsg)
        fd.append("state",1)
        fd.append("sufdate",this.sufdate)
        fd.append("offernum",row.offernum)
        fd.append("buynum",row.buynum)
        this.$axios.post(url,fd).then(r=>{
          this.$message.success(r.data)
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        });
      });
    },
    cancel(row) {
      console.log(row)
      this.$confirm('确定取消采购该供应商货物?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        console.log(row)
        let bidmsg = "对不起,您投递的标书未中标, 标书信息信息: 采购编号:"+this.bmSerial+'、商品名'+row.goodsname+'、类型'+row.type+'、规格'+row.standerd+'、报价'+row.offernum+'、竞标描述'+row.offerinfo+'、采购数量'+row.buynum
        let url = '/csc/successful/winBidMsg'
        let fd = new FormData
        fd.append("buynumber",this.bmSerial)
        fd.append("usernumber",row.usernumber)
        fd.append("bid",bidmsg)
        fd.append("state",0)
        fd.append("sufdate",this.sufdate)
        fd.append("offernum",row.offernum)
        fd.append("buynum",row.buynum)
        this.$axios.post(url,fd).then(r=>{
          this.$message.success(r.data)
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        });
      });
    },
    closeWin(){
      this.$emit("closeDialog")
    }
  }
}
</script>

<style scoped>

</style>